<template>
  <div id="JobChance">
    <div class="banner container-fuild text-center">{{info.title}}</div>
    <div class="container" v-if='info'>
      <div class="mt">{{info.dirnote}}</div>
        <!-- <van-empty v-if="list.length==0" description="暂无数据" /> -->
       
     <div class="row_bw mt warp" >
       <div v-for="(i,j) in info.piclist.split(',')" :key='j'>
         <img :src="$base+i" class="img2" @click="open_img(i)"/>
       </div>
     </div>

     <div class="mt mt" v-if='info.matelist'>
        <div v-for="(i,m) in info.matelist.split(',')" :key='m'>
          <el-link :href="$base+i" target="_blank">{{$base+i}}</el-link>
       </div>
     </div>
       
      
     
<van-divider />
        
     
    </div>
  </div>
</template>
<script>
import { WOW } from "wowjs";

import { Empty, Card ,Divider} from "vant"; 
export default {
  name: "File",
  data() {
    return {
      user: "",
      list:[],
      file:[],
      file2:[],
      info:''
      
    };
  },
  mounted() {
    // let lg = localStorage.getItem("lg");
    // if (!lg) {
    //   this.$router.replace("/login");
    // }
     let info=this.$route.query.info;
     this.info=info;
     console.log('info:',info);

     let suer= JSON.parse(localStorage.getItem('user'));
    this.user=suer;
    var wow = new WOW();
    wow.init();
    let user = JSON.parse(localStorage.getItem("user"));
    this.user = user;
    // this.get_file();
  },
  methods: {
   open_img(e){
      window.open(this.$base+e)
   },
    
  },
};
</script>
<style scoped>
.img2{
  width: 20vw;
  height: 100%;
}
.dis{
    color:#a1a3a6;
}
.banner {
  color: #fff;
  font-size: 30px;
  height: 150px;
  line-height: 150px;
  background-image: url("../assets/img/banner_2.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: scroll;
  background-position: center center;
}
.JobChance-container {
  margin: 100px;
  padding: 30px;
  transition: all ease 0.5s;
  border: 1px dashed salmon;
}
.JobChance-container h2 {
  color: rgb(255, 102, 19);
  font-weight: bolder;
  text-align: center;
}
.JobChance-container p {
  font-size: 20px;
  color: rgb(255, 102, 19);
  font-weight: 700;
}
.JobChance-container ol {
  list-style-type: decimal;
  padding-left: 30px;
}
.JobChance-container ol > li {
  font-size: 14px;
  line-height: 2.7rem;
}
@media screen and (max-width: 997px) {
  .JobChance-container {
    margin: 20px 0;
    padding: 20px;
    border: 1px dashed salmon;
  }
}
</style>

